<template>
  <div>
    <div>
      <p>投资总额</p>
      <el-input v-model="total" name="total" placeholder="投资总额"></el-input>
    </div>
    <el-table
            :data="tableData"
            style="width: 100%">
      <el-table-column
              prop="rate"
              label="汇率"
              width="180">
        <template slot-scope="scope">

          <el-input v-model="scope.row.rate" ></el-input>
        </template>
      </el-table-column>
      <el-table-column
              prop="raised"
              label="投资额"
              width="180">
      </el-table-column>
      <el-table-column
              prop="amt"
              label="总值">
      </el-table-column>
    </el-table>
    <el-button :disabled="loading" type="primary" @click="onSubmit">确认</el-button>
  </div>

</template>

<script>
import HelloWorld from './components/HelloWorld.vue'

export default {
  name: 'app',
  components: {
    HelloWorld
  },
  data() {
    return {
      loading:false,
      total:0,
      tableData: [{
        rate: 0,
        raised: 0,
        amt: 0
      },{
        rate: 0,
        raised: 0,
        amt: 0
      },{
        rate: 0,
        raised: 0,
        amt: 0
      },],
    }
  },
  methods:{
    onSubmit(){
      this.loading = true;

      if(this.total.indexOf('.') !== -1){
        this.$message.error('不支持小数');
        return
      }
      if(this.total > 2000){
        this.$message.error('临时算法，最大支持2000，否则可能导致设备卡顿');
        return;
      }
      this.$axios.post('http://portion.laotulv.cn/portion.php',{
        total:this.total,
        data:this.tableData
      }).then(r=>{
        this.loading = false;
        // console.log(r)
        this.tableData = r.data;
      })
      return;

      this.computeDiff()
    },
    computeDiff(){
      this.loading = true;
      let current = 0;  // 当前最大差值
      let amtArr = [];  // 循环时总值
      let minDiff = 0;  // 最小差值
      let minDiffBelong = []; // 最小差值所在数组
      let init = false;
      for(let i =1; i<= this.total;i++){
        // amtArr = [];
        for(let i1 =1; i1<= this.total;i1++){
          for (let i2 =1; i2<= this.total;i2++) {
            if(i+i1+i2 != this.total){
              continue;
            }

            amtArr = [
              Math.round(i*this.tableData[0].rate),
              Math.round(i1*this.tableData[1].rate),
              Math.round(i2*this.tableData[2].rate)
            ];
            current = this.subtractEach(amtArr)
            // console.log(current)
            if(!init){
              init = true;
              minDiff = current;
              minDiffBelong = [i,i1,i2]
              continue;
            }
            if(parseInt(current) <= parseInt(minDiff)){
              minDiff = current;
              minDiffBelong = [i,i1,i2]
            }
          }
        }
      }

      this.applyVal(minDiffBelong)
      this.loading = false;
    },
    applyVal(arr){
      for (let i in arr){
        this.tableData[i].raised = arr[i]
        this.tableData[i].amt = Math.round(arr[i] * this.tableData[i].rate)
      }
    },
    subtractEach(arr){
      let subtractRes = [];
      for (let f of arr){
        for (let s of arr){
          subtractRes.push(parseInt(Math.abs(
            f-s
          )));
        }
      }
      // 取最大值
      return subtractRes.sort(function (a,b)
      {
        return a - b
      }).pop()
    }
  }
}
</script>

<style>
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>
